<template>
    <el-dialog class="ba-operate-dialog" :model-value="baTable.form.operate == 'Detail' ? true : false"
        @close="baTable.toggleForm">
        <template #header>
            <div class="title" v-drag="['.ba-operate-dialog', '.el-dialog__header']" v-zoom="'.ba-operate-dialog'">提现详情
            </div>
        </template>

        <el-scrollbar v-loading="baTable.form.loading" class="ba-table-form-scrollbar">
            <div class="ba-operate-form" :class="'ba-' + baTable.form.operate + '-form'"
                v-if="!isEmpty(baTable.form.extend!.detail)">
                <el-descriptions :column="2" border title="申请信息">
                    <el-descriptions-item label="ID">
                        {{ baTable.form.extend!.detail.id }}
                    </el-descriptions-item>
                    <el-descriptions-item label="申请用户">
                        {{ baTable.form.extend!.detail.user.nickname }}
                    </el-descriptions-item>
                    <el-descriptions-item label="银行名称">
                        {{ baTable.form.extend!.detail.user_bank_title }}
                    </el-descriptions-item>
                    <el-descriptions-item label="银行卡号">
                        {{ baTable.form.extend!.detail.bank_card_number }}
                    </el-descriptions-item>
                    <el-descriptions-item label="提现金额">
                        {{ baTable.form.extend!.detail.withdrawal_money }}
                    </el-descriptions-item>
                    <el-descriptions-item label="提现状态">
                        {{ baTable.form.extend!.detail.status_name }}
                    </el-descriptions-item>
                    <el-descriptions-item label="是否打款">
                        {{ baTable.form.extend!.detail.payment_status_name }}
                    </el-descriptions-item>
                    <el-descriptions-item label="申请日期">
                        {{ baTable.form.extend!.detail.create_time }}
                    </el-descriptions-item>
           
                </el-descriptions>
                <el-divider />
                <el-descriptions :column="2" border title="操作" v-if="baTable.form.extend!.detail.status == 1 && baTable.form.extend!.detail.payment_status == 1">
                    <el-descriptions-item :width="120" :span="2" label="审核状态" label-class-name="color-red">
                        <el-radio-group v-model="baTable.form.extend!.detail.status">
                            <el-radio label="1" border>待审核</el-radio>
                            <el-radio label="2" border>审核通过</el-radio>
                            <el-radio label="4" border>拒绝通过</el-radio>
                        </el-radio-group>

                    </el-descriptions-item>
                    <el-descriptions-item :width="120" :span="2" label="拒绝理由" label-class-name="color-red"
                        v-if="baTable.form.extend!.detail.status == '4'">
                        <el-input v-model="baTable.form.extend!.detail.fail_desc" :rows="2" type="textarea"
                            placeholder="请输入拒绝理由" />
                    </el-descriptions-item>
                </el-descriptions>
             
            </div>
        </el-scrollbar>
        <template #footer>
            <div :style="'width: calc(100% - ' + baTable.form.labelWidth! / 1.8 + 'px)'">
                <el-button @click="baTable.toggleForm('')">{{ t('Cancel') }}</el-button>
                <el-button v-blur :loading="baTable.form.submitLoading" @click="confirmSubmit(baTable.form.extend)"
                    type="primary">
                    确认
                </el-button>
            </div>
        </template>
    </el-dialog>
</template>
   
   
<script setup lang="ts">
import { inject, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import type BaTable from '/@/utils/baTable'
import { auditWithdrawal } from '/@/api/backend'
import { isEmpty } from 'lodash-es'
import { ElNotification, ElMessage, ElMessageBox } from 'element-plus'
import baTableClass from '/@/utils/baTable'
import FormItem from '/@/components/formItem/index.vue'
import { timeFormat } from '/@/utils/common'
const baTable = inject('baTable') as baTableClass

const { t } = useI18n()

const confirmSubmit = (items: any) => {

    if (items.detail.status == 1) {
        return ElNotification.error('请选择审核状态')
    }
    if (items.detail.status == 4 && isEmpty(items.detail.fail_desc)) {
        return ElNotification.error('拒绝理由不能为空')
    }
    ElMessageBox.confirm(
        '再次确认审核当前操作码？',
        '温馨提示',
        {
            confirmButtonText: '确认',
            cancelButtonText: '取消',
            type: 'warning',
            showClose: false,
            closeOnClickModal: false, //是否可通过点击遮罩关闭
            closeOnPressEscape: false
        }
    ).then(() => {
        auditWithdrawal(items.detail).then((res) => {
                baTable.toggleForm()
                baTable.onTableHeaderAction('refresh', {})
            })
    }).catch(() => {
        ElMessage({
            type: 'info',
            message: 'Delete canceled',
        })
    })
}
</script>
   
<style scoped lang="scss">
:deep(.color-red) {
    color: var(--el-color-danger) !important;
}

.table-el-tree {
    :deep(.el-tree-node) {
        white-space: unset;
    }

    :deep(.el-tree-node__content) {
        display: block;
        align-items: unset;
        height: unset;
    }
}

.info-content {
    word-wrap: break-word;
    word-break: break-all;
}

.table-header-operate-text {
    margin-left: 6px;
}

.diff-box :deep(.d2h-file-wrapper) {
    border: 1px solid #ebeef5;
}

.diff-box-title {
    display: flex;
    font-weight: bold;
    line-height: 40px;
    align-items: center;
    justify-content: center;
}
</style>
   